<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>申请认证</title>
    <link rel="stylesheet" href="/index.css"/>
    <script src="/js/vue.js"></script>
    <script src="/index.js"></script>
    <script src="/js/axios.min.js"></script>
    <script src="/js/city.js"></script>
</head>
<body>
<div id="app">
    <p>认证优势：<br>
        <br>-能签约全部展示的优质开发者<br>
        <br>独享展示标签<br>
        <br>-提升企业技术水平公信力，<br>提高约单转化率
    </p><br>
    <div class="container">
    <el-form  label-width="150px" >
        <el-form-item label="企业名称">
            <el-input v-model="company.company_name" ></el-input>
        </el-form-item>
        <el-form-item label="工商执照注册号/统一社会信用代码"><br>
            <el-input v-model="company.register" ></el-input>
        </el-form-item>
        <el-form-item label="联系方式">
            <el-input v-model="company.company_tel" ></el-input>
        </el-form-item>
        <el-form-item label="企业邮箱">
            <el-input v-model="company.company_email" ></el-input>
        </el-form-item>
        <el-form-item label="工作城市">
            <el-input v-model="company.job_add" ></el-input>
        </el-form-item>
        <el-form-item label="企业地址（每次保存或修改都必须选择）">
           <br> <div>
                <el-cascader :props="{value:'label', label: 'label', children: 'children'}"
                             :options="job_add"
                             v-model="company.companyAdd"
                             expand-trigger="hover"
                             change-on-select clearable placeholder="请选择地区位置">

                </el-cascader>
            </div>
        </el-form-item>
        <el-form-item label="企业创立时间">
            <div class="block">
                <span class="demonstration"></span>
                <el-date-picker
                        v-model="company.company_date"
                        type="datetime"
                        placeholder="选择日期时间">
                </el-date-picker>
            </div>
        </el-form-item>
        <el-form-item label="法人">
            <el-input v-model="company.legal_person" ></el-input>
        </el-form-item>
        <el-form-item label="企业规模">
            <el-select v-model="company.company_scale" placeholder="">
                <el-option label="50人以下" value="50人以下"></el-option>
                <el-option label="50~100人" value="50~100人"></el-option>
                <el-option label="100~150人" value="100~150人"></el-option>
                <el-option label="150~500人" value="150~500人"></el-option>
                <el-option label="500~1000人" value="500~1000人"></el-option>
                <el-option label="1000人以上" value="1000人以上"></el-option>
            </el-select>
        </el-form-item>
        <el-form-item label="融资">
            <el-radio v-model="company.financing" label="1">融</el-radio>
            <el-radio v-model="company.financing" label="0">不融</el-radio>
        </el-form-item>
        <el-form-item label="上传企业logo">
            <el-input v-model="company.company_img_url"  type="text"></el-input>
        </el-form-item>
        <el-form-item>
            <el-button type="primary" @click="saveCompany">立即认证</el-button>
        </el-form-item>
    </el-form>
    </div>
</div>

</body>
</html>
<script>
    var vm=new Vue({
        el: "#app",
        data: {
            company_image_url:'',
            job_add: cities,
            company:{
                company_add:'',
                companyAdd:[],
            },
        },
        methods: {
            handleChange(val){
                console.log(val)
            },
            handleAvatarSuccess(res, file) {
                this.company_image_url = URL.createObjectURL(file.raw);
            },
            beforeAvatarUpload(file) {
                const isJPG = file.type === 'image/jpeg';
                const isLt2M = file.size / 1024 / 1024 < 2;

                if (!isJPG) {
                    this.$message.error('上传头像图片只能是 JPG 格式!');
                }
                if (!isLt2M) {
                    this.$message.error('上传头像图片大小不能超过 2MB!');
                }
                return isJPG && isLt2M;
            },
            saveCompany:function(){
                var company_id = window.localStorage.getItem("company_id")
                var company_name = window.localStorage.getItem("company_name")
                this.company.company_add=this.company.companyAdd.toString();
                console.log(this.company)
                axios.post('/company/update3',this.company)
                    .then(function (response) {
                        console.log(response.data);
                        if(response.data==1){
                            alert("认证成功！")
                            location.href="9.html"
                        }
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
            }
        },
        mounted() {
            var _this = this
            var company_id = window.localStorage.getItem("company_id")
            console.log("主键为："+ company_id)
            axios.get('/company/update3',{
                params:{
                    company_id: company_id
                }
            })
                .then(function (response){
                    _this.company = response.data
                    console.log(response.data);
                })
                .catch(function (error){
                    console.log(error);
                });

        },
    })

</script>

<style>
    p{
      margin-top: auto;
        color:#F1C22E
    }
    .container{
        position: absolute;
        top: 60%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }
    .el-main {
        background-color: #E9EEF3;
        color: #333;
        text-align: center;
        line-height: 160px;
    }
    .el-input{
        width:300px;
    }
    body > .el-container {
        margin-bottom: 40px;
    }

    .el-container:nth-child(5) .el-aside,
    .el-container:nth-child(6) .el-aside {
        line-height: 260px;
    }

    .el-container:nth-child(7) .el-aside {
        line-height: 320px;
    }

    .linkage {display: flex;}

    div { margin-right: 5px }

    .avatar-uploader .el-upload {
        border: 1px dashed #d9d9d9;
        border-radius: 6px;
        cursor: pointer;
        position: relative;
        overflow: hidden;
    }
    .avatar-uploader .el-upload:hover {
        border-color: #409EFF;
    }
    .avatar-uploader-icon {
        font-size: 28px;
        color: #8c939d;
        width: 178px;
        height: 178px;
        line-height: 178px;
        text-align: center;
    }
    .avatar {
        width: 178px;
        height: 178px;
        display: block;
    }
    .user-icon-tips{
        color:red;
    }
</style>
